<template>
  <div>
    <el-row type="flex" justify="space-between">
      <el-col :span="8">
        <div>
          <el-button type="primary" @click="dialogVisible = true">填写《构音障碍评定记录表》</el-button>
        </div>
      </el-col>
      <el-col :span="3">
        <div>
          <el-input v-model="pgForm.fugl_meyer_input1" placeholder="" readonly style="width: 60%;"></el-input><span> 分</span>
        </div>
      </el-col>
      <el-col :span="10">
        <div>
          <el-input v-model="pgForm.fugl_meyer_input2" placeholder="" readonly></el-input>
        </div>
      </el-col>
    </el-row>

    <el-dialog
      title="查看表单"
      :visible.sync="dialogVisible"
      width="60%"
      center>

      <el-row>
        <el-col>
          <span>Ⅰ无支撑坐位</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList1">
              <el-checkbox label="0 不能保持坐位">不能保持坐位</el-checkbox>
              <el-checkbox label="1 能坐，但少于5min">能坐，但少于5min</el-checkbox>
              <el-checkbox label="2 能坚持坐5min">能坚持坐5min</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input3" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>Ⅱ 健侧"展翅"反应</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList2">
              <el-checkbox label="0 肩部无外展或肘关节无伸展">肩部无外展或肘关节无伸展</el-checkbox>
              <el-checkbox label="1 反应减弱">反应减弱</el-checkbox>
              <el-checkbox label="2 反应正常">反应正常</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input4" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>Ⅲ 患侧“展翅”反应</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList3">
              <el-checkbox label="0 肩部无外展或肘时关节无伸展">肩部无外展或肘时关节无伸展</el-checkbox>
              <el-checkbox label="1 反应减弱">反应减弱</el-checkbox>
              <el-checkbox label="2 反应正常">反应正常</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input5" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>Ⅳ 支撑站位</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList4">
              <el-checkbox label="0 不能站立">不能站立</el-checkbox>
              <el-checkbox label="1 在他人的最大支撑下可站立">在他人的最大支撑下可站立</el-checkbox>
              <el-checkbox label="2 由他人稍给支撑即能站立1min">由他人稍给支撑即能站立1min</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input6" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>Ⅴ 无支撑站立</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList5">
              <el-checkbox label="0 不能站立">不能站立</el-checkbox>
              <el-checkbox label="1 不能站立1min或身体摇晃">不能站立1min或身体摇晃</el-checkbox>
              <el-checkbox label="2 能平衡站立1minl以上">能平衡站立1minl以上</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input7" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>Ⅵ 健侧站立</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList6">
              <el-checkbox label="0 不能维持1~2s">不能维持1~2s</el-checkbox>
              <el-checkbox label="1 平衡站稳达4~9s">平衡站稳达4~9s</el-checkbox>
              <el-checkbox label="2 平衡站立超过10s">平衡站立超过10s</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input8" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>Ⅶ 患侧站立</span>
          <div class="grid-content">
            <el-checkbox-group v-model="pgForm.fugl_meyer_checkList7">
              <el-checkbox label="0 不能维持1~2s">不能维持1~2s</el-checkbox>
              <el-checkbox label="1 平衡站稳达4~9s">平衡站稳达4~9s</el-checkbox>
              <el-checkbox label="2 平衡站立超过10s">平衡站立超过10s</el-checkbox>
              <el-input v-model="pgForm.fugl_meyer_input9" placeholder="备注"></el-input>
            </el-checkbox-group>
          </div>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <span>总分：</span><el-tag type="success" size="medium" style="margin-right: 100px">{{ sum }}</el-tag>
          <el-dropdown trigger="click" @command="handleCommand" v-if="$route.path == '/patient/assess/detail/'">
            <el-button type="primary" size="mini">
              输出文档<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="pdf">PDF</el-dropdown-item>
              <el-dropdown-item command="docx">Word</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-col>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
import {sendJumpPdfData, sendJumpWordData} from "@/api/gaoxin/word";

export default {
  name: "dysarthria",
  title: "构音障碍评定记录表",
  created() {
    if(this.istrans){
      this.pgForm=this.fromdata
    }
  },
  props: {
    fromdata:{},
    istrans:false,
  },
  data(){
    return{
      dialogVisible: false,
      pgForm: {
        fugl_meyer_input1: '',
        fugl_meyer_input2: '未提供每个分数区间对应的结果信息',
        fugl_meyer_input3: '',
        fugl_meyer_input4: '',
        fugl_meyer_input5: '',
        fugl_meyer_input6: '',
        fugl_meyer_input7: '',
        fugl_meyer_input8: '',
        fugl_meyer_input9: '',
        fugl_meyer_checkList1: [],
        fugl_meyer_checkList2: [],
        fugl_meyer_checkList3: [],
        fugl_meyer_checkList4: [],
        fugl_meyer_checkList5: [],
        fugl_meyer_checkList6: [],
        fugl_meyer_checkList7: [],
      }
    }
  },
  computed: {
    sum(){
      let list = this.pgForm.fugl_meyer_checkList1.concat(this.pgForm.fugl_meyer_checkList2,this.pgForm.fugl_meyer_checkList3,this.pgForm.fugl_meyer_checkList4,this.pgForm.fugl_meyer_checkList5,this.pgForm.fugl_meyer_checkList6,this.pgForm.fugl_meyer_checkList7);
      let sum = 0;
      console.log(list)
      list.forEach(item => {
        sum += +item.slice(0, 1);
      })
      console.log('sum:' ,sum)
      return sum;
    },
    taskId() {
      return this.$route.query.taskId;
    }
  },
  watch: {
    sum(val){
      if (this.$route.path != "/patient/assess/detail/") {
        this.pgForm.fugl_meyer_input1 = val
      }
    },
  },
  methods: {
    openDialog() {
      this.dialogVisible = true;
    },
    handleCommand(command) {
      this.sendData(command);
    },
    sendData(type) {
      const loading = this.$loading({
        lock: true,
        text: '努力输出中...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      if (type == 'docx') {
        sendJumpWordData({ taskId: this.taskId, jumpTableName: this.$options.name + "Jump" }).then(response => {
          if(response) {
            loading.close();
            this.$message.success("word文档输出成功！")
          };
          const data = response;
          let url = window.URL.createObjectURL(data);   // 将二进制文件转化为可访问的url
          var a = document.createElement('a');
          document.body.appendChild(a);
          a.href = url;
          a.download = this.$options.title + '.docx';
          a.click();   // 模拟点击下载
          window.URL.revokeObjectURL(url);
        })
      }
      else {
        sendJumpPdfData({ taskId: this.taskId, jumpTableName: this.$options.name + "Jump" }).then(response => {
          if(response) {
            loading.close();
            this.$message({
              message: 'pdf文档输出成功！',
              type: 'success'
            });
          };
          const data = response;
          let url = window.URL.createObjectURL(data);   // 将二进制文件转化为可访问的url
          var a = document.createElement('a');
          document.body.appendChild(a);
          a.href = url;
          a.download = this.$options.title + '.pdf';
          a.click();   // 模拟点击下载
          window.URL.revokeObjectURL(url);
        })
      }
    },
  },

}
</script>

<style scoped>

.el-checkbox-group{
  padding: 10px 20px;
}
.el-checkbox{
  display: block;
  margin-bottom: 15px;
}
.el-row{
  margin: 10px 0;
  padding: 20px 20px;
  background-color: #f9f9f9;
  flex-wrap: wrap;
  flex-direction: row;
}
.el-col {
  margin:10px 0;
}
</style>
